import { Component, OnInit } from '@angular/core';
import { OverlayService } from './overlay.service';
import { PopupComponent } from './popup/popup.component';

@Component({
  selector: 'app-root',
  template: `
    <button (click)="test1()">test1</button>
    <button (click)="test2()">test2</button>
    <button (click)="add()">add</button>
  `,
  styles: [],
})
export class AppComponent implements OnInit {
  overlayRef: any;

  constructor(
      private overlayService: OverlayService,
  ) {
  }

  ngOnInit(): void {
    this.test1();
  }

  test1() {
    this.overlayRef = this.overlayService.create(PopupComponent);
  }

  test2() {
    this.overlayRef.detach();
  }

  add() {
    this.overlayService.add('add');
  }
}
